<template>
  <BasicTable :columns="columns" :data-source="tableData">
    <template #bodyCell="{ column, record }">
      <template v-if="column.dataIndex === 'classifySubclasses'">
        <span>{{ record.classifySubclasses }}</span>
        <!-- <BindingClassificationText :value="record.classifySubclassesVal" v-if="record.isBind === 0" /> -->
      </template>
      <template v-if="column.dataIndex === 'updateTime'">
        <span>{{ formatToDateTime(record.updateTime) }}</span>
      </template>
      <template v-if="column.dataIndex === 'isCollect'">
        <CollectState :value="record.isCollect" :collect-state="COLLECT_START_STATE_4" />
      </template>
    </template>
  </BasicTable>
</template>

<script lang="ts" setup name="ExternalMovieTable">
import { reactive, ref } from 'vue'
import { formatToDateTime } from '@/utils/format'
import BasicTable from '../../../../components/BasicTable.vue'
import BindingClassificationText from '../../../../components/binding-classification/BindingClassificationText.vue'
import CollectState from '../../../../components/CollectState.vue'
import { COLLECT_START_STATE_4 } from '@/stores/modules/collect-manage/select-data-source'
import { getTableData } from '../../../../hooks/useTable'

getTableData()

const columns = [
  {
    title: '内容ID',
    dataIndex: 'contentId'
  },
  {
    title: '影片名称',
    dataIndex: 'movieName'
  },
  {
    title: '分类/子类',
    dataIndex: 'classifySubclasses'
  },
  {
    title: '线路来源',
    dataIndex: 'lineSource'
  },
  {
    title: '更新时间',
    dataIndex: 'updateTime'
  },
  {
    title: '是否已采集',
    dataIndex: 'isCollect'
  }
]

type TableData = {
  key: string
  contentId: string
  movieName: string
  classifySubclasses: string
  classifySubclassesVal: number
  lineSource: string
  updateTime: number
  isCollect: number
  isBind: number
}[]
const tableData = reactive<TableData>([
  {
    key: '1',
    contentId: '001',
    movieName: '杀破狼',
    classifySubclasses: '电影 / 动作片',
    classifySubclassesVal: 1,
    lineSource: 'aaaaa',
    updateTime: Date.now(),
    isCollect: 1,
    isBind: 1
  },
  {
    key: '2',
    contentId: '002',
    movieName: '怦然心动',
    classifySubclasses: '电影 / 喜剧片',
    classifySubclassesVal: 2,
    lineSource: 'bbbbb',
    updateTime: Date.now(),
    isCollect: 2,
    isBind: 0
  }
])
</script>
